<template>
	<view class="mine-pages-gzh" :style="{background:pageColor}" v-if="isLoad">
		<view class="flex-center flex-column">
			<image mode="widthFix" class="web-code-img" :src="configInfo.web_code_img" v-if="configInfo.web_code_img">
			</image>
			<view class="gzh-img-info rel" v-else>
				<image mode="aspectFill" class="gzh-img" :src="`https://www.peikangbao.cn/admin/anmo/mine/web-code-img.png`"></image>
				<view class="none-text f-title flex-center abs" v-if="!configInfo.web_code_img">商家还没有放公众号二维码哟~</view>
			</view>

			<view @tap.stop="$util.goUrl({url:`/pages/service`,openType:`redirectTo`})"
				class="home-btn flex-center f-sm-title c-base radius" :style="{background:primaryColor}"
				v-if="!configInfo.web_code_img">直接进入首页</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapActions,
		mapMutations
	} from "vuex"
	export default {
		data() {
			return {
				isLoad: false,
				options: {},
			}
		},
		computed: mapState({
			configInfo: state => state.config.configInfo,
			isGzhLogin: state => state.user.isGzhLogin,
		}),
		async onLoad(options) {
			options = await this.updateCommonOptions(options)
			let {
				pid = 0,
					channel_id = 0
			} = options
			options.pid = pid * 1
			options.channel_id = channel_id * 1
			this.options = options
			await this.initIndex()
			if (this.scanRecordId) {
				this.updateScanRecord()
			}
		},
		methods: {
			...mapActions(['getConfigInfo', 'getUserInfo', 'addScanRecord',
				'updateScanRecord', 'updateCommonOptions'
			]),
			...mapMutations(['updateConfigItem']),
			async initIndex() {

				let {
					pid = 0,
						channel_id = 0
				} = this.options
				let code = this.scanRecordId
				// #ifdef H5
				code = this.$util.getQueryString('code')
				// #endif
				if (pid && !code) {
					this.addScanRecord({
						type: 2,
						qr_id: pid
					})
				}
				if (channel_id && !code) {
					this.addScanRecord({
						type: 9,
						qr_id: channel_id
					})
				}

				await this.getConfigInfo()
				await this.getUserInfo()
				if (!this.userInfo.id) return
				if (channel_id) {
					await this.$api.user.bindChannel({
						channel_id
					})
				}

				this.$util.setNavigationBarColor({
					bg: this.primaryColor
				})
				this.isLoad = true
				// #ifdef H5
				this.$jweixin.hideOptionMenu()
				// #endif

			},
			initRefresh() {
				this.initIndex()
			},
		}
	}
</script>


<style lang="scss">
	.mine-pages-gzh {
		.web-code-img {
			width: 750rpx;
		}

		.gzh-img-info {
			width: 536rpx;
			height: 552rpx;
			margin-top: 114rpx;

			.gzh-img {
				width: 536rpx;
				height: 552rpx;
				border-radius: 30rpx;
			}

			.none-text {
				width: 536rpx;
				color: #2E2E31;
				bottom: -20rpx;
			}
		}

		.home-btn {
			width: 690rpx;
			height: 90rpx;
			margin-top: 126rpx;
		}
	}
</style>